<template>
  <div class="footer">
    <div class="NavbarFooter-logoContainer">
      <img src="../assets/image/logo.svg" alt="" />
    </div>

    <div class="NavbarFooter-linksLeft">
      <div>
        <a href="">工作机会</a>
        <a href="">关于</a>
        <a href="">支持</a>
      </div>
      <div>
        <a href="">媒体中心</a>
        <a href="">API</a>
        <a href="">安全中心</a>
      </div>
    </div>

    <div class="NavbarFooter-copyright">©2021暴雪娱乐有限公司版权所有。</div>
    <div class="NavbarFooter-copyright">
      在此提及的其他所有商标均是其各自所有人的财产。
    </div>
    <div class="NavbarFooter-copyright">
      由上海网之易网络科技发展有限公司运营。
    </div>

    <div class="NavbarFooter-subLinks">
      <a href="">隐私</a>
      <a href="">法律</a>
      <a href="">条款</a>
    </div>

    <div class="NavbarFooter-additionalLegal">沪网文〔2017〕9633-727号</div>
    <div class="NavbarFooter-additionalLegal">
      增值电信业务经营许可证编号：沪B2－20080012
    </div>
    <div class="NavbarFooter-additionalLegal">沪ICP备: 沪B2-20080012-5</div>

    <div class="NavbarFooter-additionalLegalLine">
      <div>互联网违法和不良信息举报电话：0571-28090163</div>
      <div>沪公网安备：31011502002167 网上有害信息专区</div>
    </div>

    <div class="NavbarFooter-additionalLegalLine2">
      <div>适龄提示：适合13岁及以上使用 家长监护工程></div>
      <div>上海市网络游戏行业自律公约</div>
    </div>

    <div class="NavbarFooter-additionalLegalLine">
      <div>上海市张江高科技园区碧波路690号5号楼301-A</div>
      <div>客服电话：0571-28090163</div>
    </div>

    <div class="NavbarFooter-additionalLegalIcons">
      <img
        src="../assets/image/icon-cn-cyberpolice-8030c963aa438de3.gif"
        alt=""
      />
      <img src="../assets/image/icon-cn-zx100-1b6b7d14bf4a236f.gif" alt="" />
      <img src="../assets/image/icon-cn-sgs-668b0f6a4fb9c4bd.gif" alt="" />
      <img src="../assets/image/icon-cn-shjbzx-ddcf1546d4122b14.gif" alt="" />
      <img
        src="../assets/image/icon-cn-culture-logo-1eefdfed9b7decc1.png"
        alt=""
      />
    </div>

    <div class="NavbarFooter-additionalLegalLine">
      健康游戏忠告：抵制不良游戏 拒绝盗版游戏 注意自我保护 谨防受骗上当
    </div>
    <div class="NavbarFooter-additionalLegalLine">
      适度游戏益脑 沉迷游戏伤身 合理安排时间 享受健康生活
    </div>
  </div>
</template>

<script>
export default {};
</script>

<style lang="scss" scoped>
.footer {
  width: 375px;
  height: 645px;
  padding: 48px 16px 0;
  box-sizing: border-box;
  display: flex;
  align-content: center;
  flex-direction: column;
  flex-wrap: wrap;
  align-items: center;

  .NavbarFooter-logoContainer {
    width: 325px;
    height: 50px;
    margin: 30px 0;
    box-sizing: border-box;
    img {
      display: inline-block;
      width: 100%;
      height: 100%;
    }
  }

  .NavbarFooter-linksLeft {
    margin: 15px 0;
    text-align: center;
    div {
      a {
        font-weight: 500;
        color: #bebec0;
        font-size: 15px;
        margin: 0 6px;
        &:nth-child(2) {
          border-left: 1px solid #bebec0;
          border-right: 1px solid #bebec0;
          padding: 0 12px;
        }
      }
    }
  }

  .NavbarFooter-copyright {
    font-size: 12px;
    color: #bebec0;
  }

  .NavbarFooter-subLinks {
    margin: 6px 0;
    a {
      font-size: 13px;
      color: #bebec0;
      margin: 0 6px;
      &:nth-child(2) {
        padding: 0 12px;
        border-left: 1px solid #bebec0;
        border-right: 1px solid #bebec0;
      }
    }
  }

  .NavbarFooter-additionalLegal {
    font-size: 12px;
    color: #bebec0;
    font-weight: 700;
  }

  .NavbarFooter-additionalLegalLine {
    text-align: center;
    font-size: 12px;
    color: #bebec0;
    margin: 6px 0;
  }

  .NavbarFooter-additionalLegalLine2 {
    text-align: center;
    font-size: 12px;
    color: #bebec0;
    font-weight: 700;
  }

  .NavbarFooter-additionalLegalIcons {
    height: 26px;
    margin: 6px 0;
    img {
      height: 100%;
      margin: 0 5px;
    }
  }
}
</style>
